444<template>
  <div style="padding: 10px">
    <div style="width: 100%">
      <el-button type="primary" @click="xianshi" icon="el-icon-edit"
        >添加</el-button
      >
    </div>
    <el-table :data="tableData" border style="width: 100%">
      <el-table-column prop="id" label="id" width="150"> </el-table-column>
      <el-table-column prop="name" label="姓名" width="150"> </el-table-column>
      <el-table-column prop="position" label="职位" width="150">
      </el-table-column>
      <el-table-column prop="type" label="挂号类型" width="150">
      </el-table-column>
      <el-table-column prop="registrationFee" label="挂号金额" width="150">
      </el-table-column>
      <el-table-column prop="telephone" label="电话" width="150">
      </el-table-column>
      <el-table-column prop="departmentTable.name" label="门诊" width="150">
      </el-table-column>
      <el-table-column prop="introduce" label="医生评价" width="150">
      </el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button size="mini" @click="handleEdit(scope.$index, scope.row)"
            >编辑</el-button
          >
        </template>
      </el-table-column>
    </el-table>

    <!-- 添加表格------------------------------------------- -->
    <el-dialog title="添加医生" :visible.sync="dialogFormVisible">
      <el-form :model="form">
        <div>
          <el-input
            placeholder="请输入内容"
            v-model="form.name"
            style="width: 83%"
          >
            <template slot="prepend">姓名</template>
          </el-input>
        </div>

        <div style="margin: 20px 0"></div>

        <el-row class="demo-autocomplete">
          <el-col :span="20">
            <el-autocomplete
              style="width: 100%"
              class="inline-input"
              v-model="form.position"
              :fetch-suggestions="querySearch"
              placeholder="请输入职位"
              @select="handleSelect"
            >
              <template slot="prepend">职位</template>
            </el-autocomplete>
          </el-col>
        </el-row>

        <div style="margin: 20px 0"></div>
        <div>
          <el-input
            placeholder="请输入联系电话"
            v-model="form.Telephone"
            class="input-with-select"
            style="width: 83%"
          >
            <el-select
              v-model="form.type"
              slot="prepend"
              placeholder="专家类型"
            >
              <el-option label="普通" value="普通"></el-option>
              <el-option label="专家" value="专家"></el-option>
            </el-select>
          </el-input>
        </div>
        <div style="margin: 20px 0"></div>
        <el-cascader
          style="width: 83%"
          :options="options"
          v-model="form.departmentId"
          :show-all-levels="false"
        ></el-cascader>
        <div style="margin: 20px 0"></div>
        挂号费
        <el-input-number
          v-model="form.registrationFee"
          label="挂号费"
        ></el-input-number>

        <div style="margin: 20px 0"></div>
        <el-form-item style="width: 83%" label="请输入医生介绍">
          <el-input type="textarea" v-model="form.introduce"></el-input>
        </el-form-item>
      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="queding">确 定</el-button>
      </div>
    </el-dialog>
    <!--添加结束-------------------------------------------------->

     <!-----修改表格------------------------------------------- -->
    <el-dialog title="收货地址" :visible.sync="dialogFormVisibleyu">
      <el-form :model="yuform">
        <div>
          <el-input
            placeholder="请输入内容"
            v-model="yuform.name"
            style="width: 83%"
          >
            <template slot="prepend">姓名</template>
          </el-input>
        </div>

        <div style="margin: 20px 0"></div>

        <el-row class="demo-autocomplete">
          <el-col :span="20">
            <el-autocomplete
              style="width: 100%"
              class="inline-input"
              v-model="yuform.position"
              :fetch-suggestions="querySearch"
              placeholder="请输入职位"
              @select="handleSelect"
            >
              <template slot="prepend">职位</template>
            </el-autocomplete>
          </el-col>
        </el-row>

        <div style="margin: 20px 0"></div>
        <div>
          <el-input
            placeholder="请输入联系电话"
            v-model="yuform.telephone"
            class="input-with-select"
            style="width: 83%"
          >
            <el-select
              v-model="yuform.type"
              slot="prepend"
              placeholder="专家类型"
            >
              <el-option label="普通" value="普通"></el-option>
              <el-option label="专家" value="专家"></el-option>
            </el-select>
          </el-input>
        </div>
        <div style="margin: 20px 0"></div>
        
        <el-cascader
          style="width: 83%"
          :options="options"
          v-model="yuform.departmentId"
          :show-all-levels="false"
        ></el-cascader>

        <div style="margin: 20px 0"></div>
        <el-input-number
          v-model="yuform.registrationFee"
          label="描述文字"
        ></el-input-number>
        <div style="margin: 20px 0"></div>
        <el-form-item style="width: 83%" label="请输入医生介绍">
          <el-input type="textarea" v-model="yuform.introduce"></el-input>
        </el-form-item>
      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisibleyu = false">取 消</el-button>
        <el-button type="primary" @click="yuding">确 定</el-button>
      </div>
    </el-dialog>
    <!--修改结束-------------------------------------------------->
  </div>
</template>

<style>
.el-select .el-input {
  width: 130px;
}
.input-with-select .el-input-group__prepend {
  background-color: #fff;
}
</style>

<script>
import { getDocterTable, addDoctor ,updateDocker} from "../../../../api/DocterTable";
import { getList } from "../../../../api/Department";
export default {
  data() {
    return {
      yuform:{
        id:"",
        name: "",
        position: "",
        type: "",
        introduce: "",
        departmentId: "",
        telephone: "",
        registrationFee: 1,
        clinicid: 1,
        yuhao: 0,
      },
      form: {
        name: "",
        position: "",
        type: "",
        introduce: "",
        departmentId: "",
        Telephone: "",
        registrationFee: 1,
        clinicid: 1,
        yuhao: 0,
      },
      value: "",
      tableData: [],
      options: [],
      restaurants: [],
      dialogFormVisible: false,
      state1: "",
      formLabelWidth: "120px",
      dialogFormVisibleyu:false
    };
  },
  mounted() {
    this.Lodwn();
    this.loadAll();
    this.bangding();
  },
  methods: {
    yuding(){

      var arr = {
           id:this.yuform.id,
          name: this.yuform.name,
          position: this.yuform.position,
          type: this.yuform.type,
          introduce: this.yuform.introduce,
          departmentId: this.yuform.departmentId,
          telephone: this.yuform.telephone,
          registrationFee: this.yuform.registrationFee,
          clinicid: 1,
          yuhao: 0,
      }
      console.log("ddd")
      console.log(arr)
      this.dialogFormVisibleyu=false;
      updateDocker(arr).then((res) => {
       if (res.success) {
          this.Lodwn();
          this.yuform = {};
          this.$message({
            message: "修改成功",
            type: "success",
          });
        } else {
          this.$message.error("修改失败");
        }
      })
    },
     handleEdit(index, row) {
       this.dialogFormVisibleyu=true
       console.log(row)
       this.yuform=row;
       console.log("dd"+this.yuform)
      },
    queding() {
      this.dialogFormVisible = false;
      this.form.departmentId = this.form.departmentId[1];

      addDoctor(this.form).then((res) => {
        if (res.success) {
          this.Lodwn();
          this.form = {};
          this.$message({
            message: "添加成功",
            type: "success",
          });
        } else {
          this.$message.error("添加失败");
        }
        ;
      });
      console.log(this.form);
    },
    xianshi() {
      this.dialogFormVisible = true;
      this.bangding();
    },
    bangding() {
      getList().then((res) => {
        if (res.success) {
          var arr = [];
          var i = [];
          for (let index = 0; index < res.result.length; index++) {
            i = 0;
            for (
              let index2 = 0;
              index2 < res.result[index].departmentTableList.length;
              index2++
            ) {
              if (i == 0) {
                i++;
                arr.push({
                  value: res.result[index].name,
                  label: res.result[index].name,
                  children: [
                    {
                      value: res.result[index].departmentTableList[index2].id,
                      label: res.result[index].departmentTableList[index2].name,
                    },
                  ],
                });
              } else {
                arr[index].children.push({
                  value: res.result[index].departmentTableList[index2].id,
                  label: res.result[index].departmentTableList[index2].name,
                });
              }
            }
          }
          this.options = arr;
          console.log(this.options);
        }
      });
    },
    loadAll() {
      getDocterTable().then((res) => {
        var arr = [];
        var count = 0;
        for (let index = 0; index < res.result.length; index++) {
          for (let index1 = 0; index1 < index; index1++) {
            if (res.result[index1].position == res.result[index].position) {
              count++;
            }
          }
          if (count == 0) {
            arr.push({
              value: res.result[index].position,
              id: res.result[index].id,
            });
          }
          count = 0;
        }

        this.restaurants = arr;

        console.log(this.restaurants);
      });
    },
    createFilter(queryString) {
      return (restaurant) => {
        return (
          restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) ===
          0
        );
      };
    },
    querySearch(queryString, cb) {
      var restaurants = this.restaurants;
      var results = queryString
        ? restaurants.filter(this.createFilter(queryString))
        : restaurants;
      // 调用 callback 返回建议列表的数据
      cb(results);
    },
    handleSelect(item) {},
    Lodwn() {
      getDocterTable().then((res) => {
        if (res.success) {
          this.tableData = res.result;
        }
      });
    },
  },
};
</script>
